<template>
  <a-modal
    :title="title"
    v-model="visible"
    @ok="handleOk"
    @cancel="handleCancel"
    :width="500">
    <a-table
      :columns="columns"
      :dataSource="dataSource"
      :pagination="false"
      :rowSelection="{selectedRowKeys: selectedRowKeys,onSelectAll:onSelectAll,onSelect:onSelectOne, onChange: onSelectChange,type: getType}"
      wrapClassName="ant-modal-cust-warp"
    >
    </a-table>
  </a-modal>
</template>

<script>

  export default {
    name: "AuditModal",
    data() {
      return {
        title:"文件列表",
        multi:false,
        loading: false,
        visible: false,
        dataSource:[],
        selectedRowKeys: [],
        dataSource2:[],
        columns:[
          {
            title: '序号',
            dataIndex: '',
            key:'rowIndex',
            width:60,
            align:"center",
            customRender:function (t,r,index) {
              return parseInt(index)+1;
            },
            customCell: (record, index)=> {
              let that=this;
              return {
                on: {
                  click: () => {
                    console.log(record);
                    that.selectedRowKeys = [];
                    that.selectedRowKeys.push(index);
                    that.dataSource2 = [];
                    that.dataSource2.push(record);
                  }
                }
              }
            }
          },
          {
            title:'文件名',
            align:"center",
            dataIndex: 'fileName',
            customCell: (record, index)=> {
              let that=this;
              return {
                on: {
                  click: () => {
                    console.log(record);
                    that.selectedRowKeys = [];
                    that.selectedRowKeys.push(index);
                    that.dataSource2 = [];
                    that.dataSource2.push(record);
                  }
                }
              }
            }
          },
        ]
      };
    },
    computed: {
      // 计算属性的 getter
      getType: function () {
        console.log("multi: ", this.multi);
        return this.multi == true ? 'checkbox' : 'radio';
      }
    },
    methods: {
      handleOk() {
        this.$emit("choose", this.dataSource2);
        this.handleCancel();
      },
      onSelectOne(record, selected) {
        if (selected === true) {
          if(this.multi){ //多选
            this.dataSource2.push(record);
          }else{  //单选
            this.dataSource2=[];
            this.dataSource2.push(record);
          }
        } else {
          if(this.multi) { //多选
            var index = -1;
            for (var i = 0; i < this.dataSource2.length; i++) {
              if (this.dataSource2[i].id == record.id) {
                index = i;
                break;
              }
            }
            if (index >= 0) {
              this.dataSource2.splice(index, 1);
            }
          }else{ //单选
            this.dataSource2=[];
          }
        }
      },
      initSource() {
        this.selectedRowKeys = [];
        this.selectionRows = [];
        this.dataSource2 = [];
      },
      onSelectAll(selected, selectedRows, changeRows) {
        if (selected === true) {
          for (var a = 0; a < changeRows.length; a++) {
            this.dataSource2.push(changeRows[a]);
          }
        } else {
          for (var b = 0; b < changeRows.length; b++) {
            this.dataSource2.splice(this.dataSource2.indexOf(changeRows[b]), 1);
          }
        }
        // console.log(selected, selectedRows, changeRows);
      },
      onSelectChange(selectedRowKeys, selectionRows) {
        this.selectedRowKeys = selectedRowKeys;
        console.log(this.selectedRowKeys);
        this.selectionRows = selectionRows;
      },
      choose(file){
        this.dataSource = [];
        //构建数据
        for (let fileKey of file.split(",")) {
          let files = {};
          files.fileName = fileKey.substring(fileKey.lastIndexOf("/")+1)
          files.url=fileKey
          this.dataSource.push(files)
        }
        this.initSource();
        this.visible = true;
      },
      close() {
        this.$emit('close');
        this.visible = false;
      },
      handleOverrule(e) {
      },
      handleCancel(e) {
        this.visible = false;
      },
    },
  }
</script>

<style scoped>

</style>